<template>
	<div class="mange_address">
		<div class="mange_address_title">
			<van-icon name="arrow-left" size="22px" style="position: absolute;left: 5px;" @click="back" />
			<p>地址管理</p>
		</div>
		<div class="address_main">
			<van-address-list
			  v-model="chosenAddressId"
			  :list="list"
			  default-tag-text="默认"
			  @add="onAdd"
			  @edit="onEdit"
			  
			/>
		</div>
	</div>
</template>

<script>
	import { Toast } from 'vant';
	import request from '../../api/request.js'
	export default {
		name:'mange_address',
	  data() {
	    return {
	      chosenAddressId: '',
	      list: [
	        
	      ],
	    };
	  },
	  async mounted() {
	  	let res=await request({
			url:'/member/address',
			method:'get',
			headers:{
				Authorization:localStorage.getItem('token')
			}
		})
		this.chosenAddressId=res.result[0].id
		for(var i in res.result){
			let item={
				id:res.result[i].id,
				name:res.result[i].receiver,
				tel:res.result[i].contact,
				address:res.result[i].fullLocation
			}
			this.list.push(item)
		}
	  },
	  methods: {
		  back() {
		  	this.$router.back()
		  },
	    onAdd() {
	      this.$router.push({
			  name:'create_address'
		  })
	    },
	    onEdit(item, index) {
	      this.$router.push({
			  name:'update_address',
			  query:{
				  item,
				  index
			  }
		  })
	    },
	  },
	};
</script>

<style lang="scss" >
	
	.mange_address{
		
		width: 100%;
		height: 100%;
		background-color: #F4F4F4;
		.mange_address_title{
			width: 100%;
			height: 6%;
			background-color: #F8F8F8;
			display: flex;
			justify-content: center;
			align-items: center;
			
			p {
				font-size: 30px;
			
			}
		}
		.address_main{
			width: 100%;
			height: 94%;
		}
	}
</style>